<!DOCTYPE html>
<html>
<head>
<title>Gallery</title>
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="js/jquery.min.js"></script>
<!-- Custom Theme files -->
<!--theme-style-->
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />	
<!--//theme-style-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Fidele  Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!---->
<script src="js/jquery.chocolat.js"></script>
		<link rel="stylesheet" href="css/chocolat.css" type="text/css" media="screen" charset="utf-8">
		<!--light-box-files -->
		<script type="text/javascript" charset="utf-8">
		$(function() {
			$('.gallery-top a').Chocolat();
		});
		</script>

<!---->
<script src="js/menu_jquery.js"></script>
</head>
<body> 
<!--header-->	
<div class="header">
	<div class="container">
		 <div class="logo">
		  	<a href="index.html"><img src="images/logo.png" alt="" ></a>
	  	 </div>
	   <div class="head-right">
	   	<div class="head-grid">
	   		<ul>
				<li ><span>+125775858</span></li>
				<li ><span>+1486754582</span></li><label>|</label>
				<li><div id="loginContainer"><a href="#" id="loginButton"><span>Login</span></a>
					<div id="loginBox">                
						  <form id="loginForm">
						           <fieldset id="body">
						              <fieldset>
						                   <label for="email">Email Address</label>
						                     <input type="text" name="email" id="email">
						                </fieldset>
						                 <fieldset>
						                            <label for="password">Password</label>
						                            <input type="password" name="password" id="password">
						                 </fieldset>
						                    <input type="submit" id="login" value="Sign in">
						                	<label for="checkbox"><input type="checkbox" id="checkbox"> <i>Remember me</i></label>
						            	</fieldset>
						            <span><a href="#">Forgot your password?</a></span>
							 </form>
				    </div>
				</div>
			</li>	
		</ul>
	</div> 	
	   <div class="top-nav">
			  <span class="menu"><img src="images/menu.png" alt=""> </span>
					<ul>
						 <li ><a href="index.html">Home</a></li>
					   	 <li ><a href="about.html">About</a></li>
					   	 <li class="active"><a href="gallery.html">Gallery</a></li>
					   	 <li><a href="blog.html">Blog</a></li>
					   	 <li><a href="codes.html">Short Codes</a></li>
					   	 <li><a href="contact.html">Contact</a></li>
						<div class="clearfix"> </div>
					</ul>

					<!--script-->
				<script>
					$("span.menu").click(function(){
						$(".top-nav ul").slideToggle(500, function(){
						});
					});
			</script>
		</div>
		</div>
		<div class="clearfix"> </div>
	</div>
</div>
<!--//header-->
<div class="banner-head">
	<div class="banner-1"> </div>
		<div class="container">
			<h1>Gallery</h1>	
		</div>
</div>
<!--content-->
<div class="gallery">
	<div class="container">
		<div class="grid">
			<div  class="col-md-4 gallery-top">
				<a href="images/ga.jpg" rel="title" class="b-link-stripe b-animate-go  thickbox">
					<figure class="effect-oscar">
						<img src="images/ga.jpg" alt="img09"/>
						<figcaption>
							<h2>Pets</h2>
							<p>Contrary to popular belief, Lorem Ipsum is not simply random text. </p>
						</figcaption>			
					</figure>
				</a>
			</div>
			<div  class="col-md-4 gallery-top">
				<a href="images/ga1.jpg" rel="title" class="b-link-stripe b-animate-go  thickbox">
					<figure class="effect-oscar">
						<img src="images/ga1.jpg" alt="img09"/>
						<figcaption>
							<h2>Pets</h2>
							<p>Contrary to popular belief, Lorem Ipsum is not simply random text. </p>
						</figcaption>			
					</figure>
				</a>
			</div>
			<div  class="col-md-4 gallery-top">
				<a href="images/ga2.jpg" rel="title" class="b-link-stripe b-animate-go  thickbox">
					<figure class="effect-oscar">
						<img src="images/ga2.jpg" alt="img09"/>
						<figcaption>
							<h2>Pets</h2>
							<p>Contrary to popular belief, Lorem Ipsum is not simply random text. </p>
						</figcaption>			
					</figure>
				</a>
			</div>	
					<div class="clearfix"> </div>
				</div>
				<div class="grid">
			<div  class="col-md-4 gallery-top">
				<a href="images/ga3.jpg" rel="title" class="b-link-stripe b-animate-go  thickbox">
					<figure class="effect-oscar">
						<img src="images/ga3.jpg" alt="img09"/>
						<figcaption>
							<h2>Pets</h2>
							<p>Contrary to popular belief, Lorem Ipsum is not simply random text. </p>
						</figcaption>			
					</figure>
				</a>
			</div>
			<div  class="col-md-4 gallery-top">
				<a href="images/ga5.jpg" rel="title" class="b-link-stripe b-animate-go  thickbox">
					<figure class="effect-oscar">
						<img src="images/ga5.jpg" alt="img09"/>
						<figcaption>
							<h2>Pets</h2>
							<p>Contrary to popular belief, Lorem Ipsum is not simply random text. </p>
						</figcaption>			
					</figure>
				</a>
			</div>
			<div  class="col-md-4 gallery-top">
				<a href="images/ga4.jpg" rel="title" class="b-link-stripe b-animate-go  thickbox">
					<figure class="effect-oscar">
						<img src="images/ga4.jpg" alt="img09"/>
						<figcaption>
							<h2>Pets</h2>
							<p>Contrary to popular belief, Lorem Ipsum is not simply random text. </p>
						</figcaption>			
					</figure>
				</a>
			</div>	
					<div class="clearfix"> </div>
				</div>
				<div class="grid">
			<div  class="col-md-4 gallery-top">
				<a href="images/ga6.jpg" rel="title" class="b-link-stripe b-animate-go  thickbox">
					<figure class="effect-oscar">
						<img src="images/ga6.jpg" alt="img09"/>
						<figcaption>
							<h2>Pets</h2>
							<p>Contrary to popular belief, Lorem Ipsum is not simply random text. </p>
						</figcaption>			
					</figure>
				</a>
			</div>
			<div  class="col-md-4 gallery-top">
				<a href="images/ga7.jpg" rel="title" class="b-link-stripe b-animate-go  thickbox">
					<figure class="effect-oscar">
						<img src="images/ga7.jpg" alt="img09"/>
						<figcaption>
							<h2>Pets</h2>
							<p>Contrary to popular belief, Lorem Ipsum is not simply random text. </p>
						</figcaption>			
					</figure>
				</a>
			</div>
			<div  class="col-md-4 gallery-top">
				<a href="images/ga8.jpg" rel="title" class="b-link-stripe b-animate-go  thickbox">
					<figure class="effect-oscar">
						<img src="images/ga8.jpg" alt="img09"/>
						<figcaption>
							<h2>Pets</h2>
							<p>Contrary to popular belief, Lorem Ipsum is not simply random text. </p>
						</figcaption>			
					</figure>
				</a>
			</div>	
					<div class="clearfix"> </div>
				</div>
				</div>
			</div>	
<!--footer-->
 	<div class="footer ">
 		<div class="footer-1"> </div>
		<div class="container">
		  <div class="footer_top">
		  	<div class="col-md-3 footer-head">
				<h4>Navigation</h4>
				  <ul class="list1">
				  	 <li><a href="index.html">Home</a></li>
				   	 <li><a href="about.html">About</a></li>
				   	 <li><a href="gallery.html">Gallery</a></li>
				   	 <li><a href="blog.html">Blog</a></li>
				   	 <li><a href="codes.html">Short Codes</a></li>
				   	 <li><a href="contact.html">Contact</a></li>
				  </ul>
			</div>
		  	
			<div class="col-md-3 footer-head">
				<h4>Recent News</h4>
			   <div class="footer-new">
			   	<div class="footer-new1">
			   		<a href="single.html"><img src="images/te.jpg" class="img-responsive" alt=""></a>
			   	</div>
			   	<div class="footer-new2">
			   		<p><a href="single.html">Masagni dolores eoquie voluptaquisquam.</a> </p>
			   	</div>
			   	<div class="clearfix"> </div>
			   </div>
			     <div class="footer-new">
			   	<div class="footer-new1">
			   		<a href="single.html"><img src="images/te2.jpg" class="img-responsive" alt=""></a>
			   	</div>
			   	<div class="footer-new2">
			   		<p><a href="single.html">Masagni dolores eoquie voluptaquisquam.</a> </p>
			   	</div>
			   	<div class="clearfix"> </div>
			   </div>
			     <div class="footer-new">
			   	<div class="footer-new1">
			   		<a href="single.html"><img src="images/te3.jpg" class="img-responsive" alt=""></a>
			   	</div>
			   	<div class="footer-new2">
			   		<p><a href="single.html">Masagni dolores eoquie voluptaquisquam. </a></p>
			   	</div>
			   	<div class="clearfix"> </div>
			   </div>
			</div>
			<div class="col-md-3 footer-head">
				<h4>Follow Us</h4>
			 <ul class="socials">
                 <li><a href="#"><i ></i></a></li>
                 <li><a href="#"><i class="dribbble"></i></a></li>
                  <li><a href="#"><i class="twitter"></i></a></li>
              </ul>
			</div>
			<div class="col-md-3 footer-head1">
			  	<h4>Location</h4>
             	<p><b>Company Name</b></p>
              	<p>Masagni dolores</p>
               <p>+17478895959</p>
			</div>
			<div class="clearfix"> </div>
		   </div>
		   <div class="footer-bottom">
		<p>Copyright &copy; 2015.Company name All rights reserved.<a target="_blank" href="http://www.17sucai.com/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></p>
    </div>
	 </div>
</div>
 	<!--//footer-->
</body>
</html>